<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>蘑菇丁自动签到</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
		 crossorigin="anonymous">
		<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
		<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
		 crossorigin="anonymous"></script>

	</head>
	<style>
		html,
    body,
    #container {
        width: 100%;
        height: 500px;
    }

    #mapContainer {
        width: 100%;
        height: 500px;
    }

    #tip {
        background-color: #fff;
        border: 1px solid #ccc;
        padding-left: 10px;
        padding-right: 2px;
        position: absolute;
        min-height: 65px;
        top: 10px;
        font-size: 12px;
        right: 10px;
        border-radius: 3px;
        overflow: hidden;
        line-height: 20px;
        min-width: 200px;
    }

    #tip input[type="button"] {
        background-color: #0D9BF2;
        height: 25px;
        text-align: center;
        line-height: 25px;
        color: #fff;
        font-size: 12px;
        border-radius: 3px;
        outline: none;
        border: 0;
        cursor: pointer;
    }

    #tip input[type="text"] {
        height: 25px;
        border: 1px solid #ccc;
        padding-left: 5px;
        border-radius: 3px;
        outline: none;
    }

    #pos {
        height: 70px;
        background-color: #fff;
        padding-left: 10px;
        padding-right: 10px;
        position: absolute;
        font-size: 12px;
        right: 10px;
        bottom: 30px;
        border-radius: 3px;
        line-height: 30px;
        border: 1px solid #ccc;
    }

    #pos input {
        border: 1px solid #ddd;
        height: 23px;
        border-radius: 3px;
        outline: none;
    }

    #result1 {
        max-height: 300px;
    }
</style>
	<body>
		<div class="container">
			<div class="row" style="margin-top: 20px">
				<div class="col-md-1 col-lg-12">
					<div class="alert alert-success " role="alert" id="success" style="display: none"></div>
					<form class="form-horizontal">
						<div class="form-group">
							<label for="phone" class="col-sm-2 control-label">手机号：</label>
							<div class="col-sm-10">
								<input type="text" class="form-control" id="phone" placeholder="手机号" name="phone">
							</div>
						</div>
						<div class="form-group">
							<label for="password" class="col-sm-2 control-label">密码：</label>
							<div class="col-sm-10">
								<input type="password" class="form-control" id="password" placeholder="password">
							</div>
						</div>

						<div class="form-group">
							<label for="province" class="col-sm-2 control-label">位置：</label>
							<div class="col-sm-3" style="margin-top: 5px">
								<input type="text" class="form-control" id="province" placeholder="省" name="province">
							</div>
							<div class="col-sm-3" style="margin-top: 5px">
								<input type="text" class="form-control" id="city" placeholder="市" name="city">
							</div>
							<div class="col-sm-4" style="margin-top: 5px">
								<input type="text" class="form-control" id="address" placeholder="街道" name="address">
							</div>
						</div>
						<div class="form-group">
							<div class="col-sm-offset-2 col-sm-10">
								<button type="button" class="btn btn-primary" id="button">提交</button>
							</div>
						</div>

					</form>

				</div>
			</div>
			<div class="row" style="position: relative;">
				<div id="mapContainer"></div>
				<div id="tip">
					<b>请输入关键字：</b>
					<input type="text" id="keyword" name="keyword" value="" onkeydown='keydown(event)' style="width: 95%;" />
					<div id="result1" name="result1"></div>
				</div>

			</div>



		</div>


		<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=9edf040f51c7ddb23a83e45d92da3e1d&plugin=AMap.Geocoder"></script>
		<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>
		<script type="text/javascript"  charset="utf-8"
		    src="http://connect.qq.com/qc_jssdk.js"
		    data-appid="101853320"
		    data-redirecturi="https://www.zoupk.top/moguding/index.html"
		></script>
		<!-- 获取qq登录信息  -->
	<script type="text/javascript">
		
		
	</script>
		
		<script type="text/javascript">
			var windowsArr = [];
			var marker = [];
			var markers;
			var longitude = "";
			var latitude = "";

			var mapObj = new AMap.Map("mapContainer", {
				resizeEnable: true,
				view: new AMap.View2D({
					resizeEnable: true,
					zoom: 13 //地图显示的缩放级别
				}),
				keyboardEnable: false
			});


			AMap.plugin('AMap.Geolocation', function() {
				var geolocation = new AMap.Geolocation({
					enableHighAccuracy: true, //是否使用高精度定位，默认:true
					timeout: 10000, //超过10秒后停止定位，默认：无穷大
					maximumAge: 0, //定位结果缓存0毫秒，默认：0
					convert: true, //自动偏移坐标，偏移后的坐标为高德坐标，默认：true
					showButton: true, //显示定位按钮，默认：true
					buttonPosition: 'RB', //定位按钮停靠位置，默认：'LB'，左下角
					buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
					showMarker: true, //定位成功后在定位到的位置显示点标记，默认：true
					showCircle: true, //定位成功后用圆圈表示定位精度范围，默认：true
					panToLocation: true, //定位成功后将定位到的位置作为地图中心点，默认：true
					zoomToAccuracy: true //定位成功后调整地图视野范围使定位位置及精度范围视野内可见，默认：false
				});
				mapObj.addControl(geolocation);
				geolocation.getCurrentPosition();
				AMap.event.addListener(geolocation, 'complete', onComplete); //返回定位信息
				AMap.event.addListener(geolocation, 'error', onError); //返回定位出错信息
				function onComplete(data) {
					// data是具体的定位信息
					longitude = data.position.lng;
					latitude = data.position.lat;

					var addresss = data.formattedAddress;

					var addresscom = data.addressComponent
					document.getElementById("province").value = addresscom.province
					document.getElementById("city").value = addresscom.city
					var addr = addresscom.province + addresscom.city + addresscom.district + addresscom.township
					// addresscom.province+" · "+addresscom.city+" · "
					var sssss = addresss.substring(addr.length, address.length)
					document.getElementById("address").value = addresscom.province + " · " + addresscom.city + " · " + sssss
				}

				function onError(data) {}
			});

			var geocoder = new AMap.Geocoder({
				city: '全国',
				radius: 1000
			});
			var clickEventListener = AMap.event.addListener(mapObj, 'click', function(e) {
				longitude = e.lnglat.getLng();
				latitude = e.lnglat.getLat();

				clearMarker();
				showInfoClick(e);
				addMarker(e.lnglat.getLng(), e.lnglat.getLat());
			});


			// 实例化点标记
			function addMarker(x, y) {
				markers = new AMap.Marker({
					icon: "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png",
					position: [x, y],
					offset: new AMap.Pixel(-30, -40)
				});

				var address;
				markers.setMap(mapObj);

			}


			function showInfoClick(e) {

				var address;
				geocoder.getAddress(e.lnglat.getLng() + ',' + e.lnglat.getLat(), function(status, result) {
					if (status === 'complete' && result.regeocode) {
						address = result.regeocode.formattedAddress;

						var addresscom = result.regeocode.addressComponent
						document.getElementById("province").value = addresscom.province
						document.getElementById("city").value = addresscom.city
						var addr = addresscom.province + addresscom.city + addresscom.district + addresscom.township
						// addresscom.province+" · "+addresscom.city+" · "
						var sssss = address.substring(addr.length, address.length)
						document.getElementById("address").value = addresscom.province + " · " + addresscom.city + " · " + sssss
					} else {
						alert(JSON.stringify(result))
					}
				});
			}

			var btn = document.getElementById("button")
			btn.onclick = function() {
				var data = {
					password: document.getElementById("password").value,
					phone: document.getElementById("phone").value,
					logintype: "android",
					uuid: "",
					singins: {
						country: "中国",
						address: document.getElementById("address").value,
						province: document.getElementById("province").value,
						city: document.getElementById("city").value,
						latitude: latitude,
						descriptio: "",
						planId: "",
						type: "",
						device: "Android",
						longitude: longitude
					}
				}

				$.ajax({
					type: 'POST',
					url: "https://www.zoupk.top/quartz/add",
					data: JSON.stringify(data),
					contentType: 'application/json; charset=UTF-8',
					dataType: "json",
					success: function() {
						console.log("ssssssssssssssssss")
						document.getElementById("success").style.display = "flex"
						document.getElementById("success").innerText = "提交成功"
						setTimeout(function() {
							window.location.href = "https://www.zoupk.top/moguding/index.html"
						}, "2000");

					},
					error: function() {
						document.getElementById("success").style.display = "flex"
						document.getElementById("success").innerText = "提交成功"
						setTimeout(function() {
							window.location.href = "https://www.zoupk.top/moguding/index.html"
						}, "2000");
					}
				});


			}


			document.getElementById("keyword").onkeyup = keydown;

			//输入提示
			function autoSearch() {
				var keywords = document.getElementById("keyword").value;
				var auto;
				//加载输入提示插件
				AMap.service(["AMap.Autocomplete"], function() {
					var autoOptions = {
						city: "" //城市，默认全国
					};
					auto = new AMap.Autocomplete(autoOptions);
					//查询成功时返回查询结果
					if (keywords.length > 0) {
						auto.search(keywords, function(status, result) {
							autocomplete_CallBack(result);
						});
					} else {
						document.getElementById("result1").style.display = "none";
					}
				});
			}

			//输出输入提示结果的回调函数
			function autocomplete_CallBack(data) {
				var resultStr = "";
				var tipArr = data.tips;
				if (tipArr && tipArr.length > 0) {
					for (var i = 0; i < tipArr.length; i++) {
						resultStr += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById(" + (i + 1) +
							",this)' onclick='selectResult(" + i + ")' onmouseout='onmouseout_MarkerStyle(" + (i + 1) +
							",this)' style=\"font-size: 13px;cursor:pointer;padding:5px 5px 5px 5px;\"" + "data=" + tipArr[i].adcode + ">" +
							tipArr[i].name + "<span style='color:#C1C1C1;'>" + tipArr[i].district + "</span></div>";
					}
				} else {
					resultStr = " π__π 亲,人家找不到结果!<br />要不试试：<br />1.请确保所有字词拼写正确<br />2.尝试不同的关键字<br />3.尝试更宽泛的关键字";
				}
				document.getElementById("result1").curSelect = -1;
				document.getElementById("result1").tipArr = tipArr;
				document.getElementById("result1").innerHTML = resultStr;
				document.getElementById("result1").style.display = "block";
			}

			//输入提示框鼠标滑过时的样式
			function openMarkerTipById(pointid, thiss) { //根据id打开搜索结果点tip
				thiss.style.background = '#CAE1FF';
			}

			//输入提示框鼠标移出时的样式
			function onmouseout_MarkerStyle(pointid, thiss) { //鼠标移开后点样式恢复
				thiss.style.background = "";
			}

			//从输入提示框中选择关键字并查询
			function selectResult(index) {
				if (index < 0) {
					return;
				}
				if (navigator.userAgent.indexOf("MSIE") > 0) {
					document.getElementById("keyword").onpropertychange = null;
					document.getElementById("keyword").onfocus = focus_callback;
				}
				//截取输入提示的关键字部分
				var text = document.getElementById("divid" + (index + 1)).innerHTML.replace(/<[^>].*?>.*<\/[^>].*?>/g, "");
				var cityCode = document.getElementById("divid" + (index + 1)).getAttribute('data');
				document.getElementById("keyword").value = text;
				document.getElementById("result1").style.display = "none";
				//根据选择的输入提示关键字查询
				mapObj.plugin(["AMap.PlaceSearch"], function() {
					var msearch = new AMap.PlaceSearch(); //构造地点查询类
					AMap.event.addListener(msearch, "complete", placeSearch_CallBack); //查询成功时的回调函数
					msearch.setCity(cityCode);
					msearch.search(text); //关键字查询查询
				});
			}

			//定位选择输入提示关键字
			function focus_callback() {
				if (navigator.userAgent.indexOf("MSIE") > 0) {
					document.getElementById("keyword").onpropertychange = autoSearch;
				}
			}

			//输出关键字查询结果的回调函数
			function placeSearch_CallBack(data) {
				//清空地图上的InfoWindow和Marker
				windowsArr = [];
				marker = [];
				mapObj.clearMap();
				var resultStr1 = "";
				var poiArr = data.poiList.pois;
				var resultCount = poiArr.length;
				for (var i = 0; i < resultCount; i++) {
					resultStr1 += "<div id='divid" + (i + 1) + "' onmouseover='openMarkerTipById1(" + i +
						",this)' onmouseout='onmouseout_MarkerStyle(" + (i + 1) +
						",this)' style=\"font-size: 12px;cursor:pointer;padding:0px 0 4px 2px; border-bottom:1px solid #C1FFC1;\"><table><tr><td><img src=\"http://webapi.amap.com/images/" +
						(i + 1) + ".png\"></td>" + "<td><h3><font color=\"#00a6ac\">名称: " + poiArr[i].name + "</font></h3>";
					resultStr1 += TipContents(poiArr[i].type, poiArr[i].address, poiArr[i].tel) + "</td></tr></table></div>";
					addmarker(i, poiArr[i]);
				}
				mapObj.setFitView();
			}

			//鼠标滑过查询结果改变背景样式，根据id打开信息窗体
			function openMarkerTipById1(pointid, thiss) {
				thiss.style.background = '#CAE1FF';
				windowsArr[pointid].open(mapObj, marker[pointid]);
			}

			//添加查询结果的marker&infowindow
			function addmarker(i, d) {
				var lngX = d.location.getLng();
				var latY = d.location.getLat();
				var markerOption = {
					map: mapObj,
					icon: "http://webapi.amap.com/images/" + (i + 1) + ".png",
					position: new AMap.LngLat(lngX, latY)
				};
				var mar = new AMap.Marker(markerOption);
				marker.push(new AMap.LngLat(lngX, latY));

				var infoWindow = new AMap.InfoWindow({
					content: "<h3><font color=\"#00a6ac\">  " + (i + 1) + ". " + d.name + "</font></h3>" + TipContents(d.type, d.address,
						d.tel),
					size: new AMap.Size(300, 0),
					autoMove: true,
					offset: new AMap.Pixel(0, -30)
				});
				windowsArr.push(infoWindow);
				var aa = function(e) {
					var nowPosition = mar.getPosition(),
						lng_str = nowPosition.lng,
						lat_str = nowPosition.lat;
					infoWindow.open(mapObj, nowPosition);
					document.getElementById("lngX").value = lng_str;
					document.getElementById("latY").value = lat_str;
				};
				AMap.event.addListener(mar, "mouseover", aa);
			}

			//infowindow显示内容
			function TipContents(type, address, tel) { //窗体内容
				if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {
					type = "暂无";
				}
				if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address ==
					"undefined") {
					address = "暂无";
				}
				if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {
					tel = "暂无";
				}
				var str = "  地址：" + address
				return str;
			}

			function keydown(event) {
				var key = (event || window.event).keyCode;
				var result = document.getElementById("result1")
				var cur = result.curSelect;
				if (key === 40) { //down
					if (cur + 1 < result.childNodes.length) {
						if (result.childNodes[cur]) {
							result.childNodes[cur].style.background = '';
						}
						result.curSelect = cur + 1;
						result.childNodes[cur + 1].style.background = '#CAE1FF';
						document.getElementById("keyword").value = result.tipArr[cur + 1].name;
					}
				} else if (key === 38) { //up
					if (cur - 1 >= 0) {
						if (result.childNodes[cur]) {
							result.childNodes[cur].style.background = '';
						}
						result.curSelect = cur - 1;
						result.childNodes[cur - 1].style.background = '#CAE1FF';
						document.getElementById("keyword").value = result.tipArr[cur - 1].name;
					}
				} else if (key === 13) {
					var res = document.getElementById("result1");
					if (res && res['curSelect'] !== -1) {
						selectResult(document.getElementById("result1").curSelect);
					}
				} else {
					autoSearch();
				}
			}


			function updateIcon() {

				marker.setIcon('//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-red.png')
			}

			// 清除 marker
			function clearMarker() {

				if (markers) {
					markers.setMap(null);
					markers = null;
				}
			}
		</script>




	</body>
</html>
